<!DOCTYPE html>
<html lang="ru">
<head>
  <title>Test::jquery</title>
  <meta charset="UTF-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <script src="jquery.min.js"></script>
  <script>
    function onUsernameChanged(input) {
      var val = $('#username').val();
      $('#log').append('onUsernameChanged(' + val + ')<br/>');
      $("h2").text(val);
    }

    function onPasswordChanged() {
      var val = $('#password').val();
      $('#log').append('onPasswordChanged(' + val + ')<br/>');
      $("h2").text(val);
    }

    function onRememberMeChanged() {
      var val = $('#rememberMe').val();
      $('#log').append('onRememberMeChanged(' + val + ')<br/>');
      $("h2").text(val);
    }
  </script>
</head>
<body>
<h1>Page with JQuery</h1>

<br/>
<h1>Now typing: </h1>
<div id="log"></div>
<h2></h2>
<div style="width: 400px">
  <form>
    <fieldset title="Login form">
      <label> Username:
        <input id="username" name="username" value="" onchange="onUsernameChanged(this);"/>
      </label> <br/>
      <label>Password:
        <input id="password" name="password" class="masked" value="" onchange="onPasswordChanged();"/>
      </label> <br/>
      <input type="checkbox" id="rememberMe" name="rememberMe" onchange="onRememberMeChanged();">Remember me<br/><br/>
    </fieldset>
    <input type="button" id="some-button" value="click me">
  </form>
</div>
</body>
</html>
